<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .highlight {
            background-color: red;
        }
    </style>
</head>

<body>
    用户名：<input type="text" id="t1"><br> 密码：
    <input type="text" id="t2"><br>
    <input type="button" value="按钮" onclick="f1()">

    <script>
        //检测用户名是否是3-6位，密码是否是6-8位，如果不满足要求高亮显示文本框
        function f1() {
            var tName = document.getElementById("t1");
            var tPWD = document.getElementById("t2");

            //判断用户名是否是3-6位
            if (tName.value.length < 3 || tName.value.length > 6) {
                tName.className = "highlight";
                alert("用户名应该在3-6");
                return;
            }else{
                tName.className = "";
            }


            alert("please sign up");
        }
    </script>
</body>

</html>